<div class="search-engine" *ngIf="SEARCH_ENGINE_LIST && SEARCH_ENGINE_LIST.length > 0">
  <div class="input-wrapper">
    <div
      class="left-icon"
      (click)="toggleEngine($event)"
      [ngStyle]="{ 'background-image': 'url(' + currentEngine.icon + ')' }"
    >
    </div>

    <input
      id="search-engine-input"
      type="text"
      autofocus
      [placeholder]="currentEngine.placeholder || ''"
      [(ngModel)]="keyword"
      (keyup)="onKey($event)"
    />

    <div class="search-icon" (click)="onSearch()"></div>
  </div>

  <div class="engine-main" *ngIf="showEngine">
    <div
      class="item"
      *ngFor="let item of SEARCH_ENGINE_LIST; let i=index"
      (click)="clickEngineItem(i)"
    >
      <img class="icon" [src]="item.icon" alt="" />
      <span class="name">{{ item.name }}</span>
    </div>
  </div>
</div>
